<template>
  <div class="we_index">
    <!-- V1.0 -->
    <!-- <div class="we_left">
      <left-content :echartsObj="echartsLicaiObjql" :modelObj="licaiObj" :modelNo="one" :mainModel="licaiModel" class="model_margin"></left-content>
      <left-content :echartsObj="echartsLicaiObjfl" :modelObj="fanliObj" :modelNo="two" :mainModel="fanliModel"></left-content>
    </div>
    <div class="we_right">
      <right-content :echartsObj="echartsLicaiObjcf" :baseInfo="wegoBaseInfoChifeng" :mainRightModel="xiaogeModelChifeng" class="model_margin"></right-content>
      <right-content :echartsObj="echartsLicaiObjhhht" :baseInfo="wegoBaseInfoHhht" :mainRightModel="xiaogeModelHhht"></right-content>
    </div> -->
    <!-- v1.11 -->
    <div class="wego_info_pane">
      <wego :echartsObj="echartsLicaiObjcf" :baseInfo="wegoBaseInfoChifeng" :mainRightModel="xiaogeModelChifeng" :leftClass="left"></wego>
    </div>
    <div class="wego_info_pane">
       <wego :echartsObj="echartsLicaiObjhhht" :baseInfo="wegoBaseInfoHhht" :mainRightModel="xiaogeModelHhht" :leftClass="right"></wego>
    </div>
  </div>
</template>

<script>
// import { fetchToken, getWhere, getFanli, getWego} from '../api/api'
import { fetchToken, getWego} from '../api/api'
import wego from './wego/index'
// import LeftContent from './leftcontent'
// import RightContent from './rightcontent'

export default {
  components: {
    // LeftContent,
    // RightContent
    wego
  },
  data () {
    return {
      timer: null,
      one: 1,
      two: 2,
      left: true,
      right: false,
      licaiModel: {
        logo: require('../assets/logo.png'),
        name: '去哪理财'
      },
      fanliModel: {
        logo: require('../assets/fanli.png'),
        name: '每日返利'
      },
      xiaogeModelChifeng: {
        logo: require('../assets/xiaoge.png'),
        name: '小哥出行-赤峰'
      },
      xiaogeModelHhht: {
        logo: require('../assets/xiaoge.png'),
        name: '小哥出行-呼和浩特'
      },
      licaiObj: {},
      fanliObj: {},
      wegoBaseInfoChifeng: {},
      wegoBaseInfoHhht: {},
      echartsLicaiObjql: [],
      echartsLicaiObjfl: [],
      echartsLicaiObjcf: [],
      echartsLicaiObjhhht: []
    }
  },
  created(){
    this.QuWhere();
    clearInterval(this.timer)
    this.timer = setInterval(() => {
      this.QuWhere();
    }, 60000)
  },
  methods: {
    echartsObjData(datas) {
      return  {
        color: ['#3ae5f9'],
        tooltip: {axisPointer : { type : 'shadow' } },
        grid: { left: '3%', right: '4%',  bottom: '0',  containLabel: true },
        xAxis: [{
          type : 'category',
          data : datas.xAxis[0].data,
          axisTick: { alignWithLabel: true },
          axisLabel: { color: '#fff' },
          axisLine: { show: false },
          axisTick: { show: false }
        }],
        yAxis: [{
          type : 'value',
          name: datas.yAxis[0].name,
          nameTextStyle: { color: '#adafab', padding: [0, 0, 0, 30] },
          axisLabel: { color: '#fff' },
          axisLine: { show: false },
          splitLine: { show: true, lineStyle: { color: '#333b56' }
          }
        }],
        series : [{
          name: datas.yAxis[0].name,
          type: 'bar',
          tooltip: {
            formatter: function (param) {
              // return param.seriesName + ': ' + param.data
              return param.data
            }
          },
          barWidth: '45%',
          data: datas.series[0].data,
        }]
      }
    },
    QuWhere () {
      fetchToken().then(res => {      
        this.$store.commit('SET_USER_TOKEN', res.data.data);
        if (res.data.data) {
          // 去哪儿理财接口数据请求
          // getWhere().then(resp => {
          //   if (resp.data.data) {
          //     this.licaiObj = {
          //       // 注册人数
          //       registerCount: resp.data.data.registerCount,
          //       // 总投资
          //       investTotalCount: resp.data.data.investTotalCount,
          //       // 总返利
          //       backTotalCount: resp.data.data.backTotalCount
          //     }
          //     // 去哪儿理财echarts渲染数据
          //     // 七日投资
          //     const licaiEchartsObjtz = this.echartsObjData(resp.data.data.returnSevenInvestMap);
              
          //     // 七日返利
          //     const licaiEchartsObjfl = this.echartsObjData(resp.data.data.returnSevenBackMap);
          //     this.echartsLicaiObjql.push(licaiEchartsObjtz);
          //     this.echartsLicaiObjql.push(licaiEchartsObjfl);
          //   }
          // });
          // 请求返利数据接口
          // getFanli().then(rr => {
          //   if (rr.data.data) {
          //     this.fanliObj = {
          //       // 注册人数
          //       registerCount: rr.data.data.registerCount,
          //       // 今日订单
          //       todayOrderCount: rr.data.data.todayOrderCount,
          //       // 总返利
          //       backTotal: rr.data.data.backTotal,
          //       // 总提现
          //       withdrawTotal: rr.data.data.withdrawTotal
          //     }
          //     // 返利echarts渲染数据
          //     // 七日投资
          //     const licaiEchartsObjtz = this.echartsObjData(rr.data.data.returnSevenRegisterCountMap);
          //     // 七日返利
          //     const licaiEchartsObjfl = this.echartsObjData(rr.data.data.returnSevenOrderCountMap);
          //     this.echartsLicaiObjfl.push(licaiEchartsObjtz)
          //     this.echartsLicaiObjfl.push(licaiEchartsObjfl)
          //   }
          // });
          // 请求小哥出行接口
          getWego().then(rp => {
            if (rp.data.data) {
              this.wegoBaseInfoChifeng = {
                 // 订单实际总收入
                cffOrderAmount: rp.data.data[0].cffPayAmount,
                // 总注册人数
                cfregisterAmount: rp.data.data[0].cfregisterAmount,
                // 押金总额
                cffDepositAmount: rp.data.data[0].cffDepositAmount,
                // 本月下单人数
                cforderPersonNumber: rp.data.data[0].cforderPersonNumber,
                // 可使用车辆
                cfavilableVehicleAmount: rp.data.data[0].cfavilableVehicleAmount,
                // 在租车辆
                cfrentVehicleAmount: rp.data.data[0].cfrentVehicleAmount,
              }
              this.wegoBaseInfoHhht = {
                 // 订单实际总收入
                cffOrderAmount: rp.data.data[1].hhhtfPayAmount,
                // 总注册人数
                cfregisterAmount: rp.data.data[1].hhhtregisterAmount,
                // 押金总额
                cffDepositAmount: rp.data.data[1].hhhtfDepositAmount,
                // 本月下单人数
                cforderPersonNumber: rp.data.data[1].hhhtorderPersonNumber,
                // 可使用车辆
                cfavilableVehicleAmount: rp.data.data[1].hhhtavilableVehicleAmount,
                // 在租车辆
                cfrentVehicleAmount: rp.data.data[1].hhhtrentVehicleAmount,
              }

              // 返利echarts渲染数据
              // 小哥出行--赤峰
              // 订单收入
              const licaiEchartsObjtz = this.echartsObjData(rp.data.data[0].returnCfOrderMap);
              // 注册人数
              const licaiEchartsObjfl = this.echartsObjData(rp.data.data[0].returnCfRegisterMap);
              this.echartsLicaiObjcf.push(licaiEchartsObjtz);
              this.echartsLicaiObjcf.push(licaiEchartsObjfl);

              // 小哥出行--呼和浩特
              // 订单收入
              const hhhttz =  this.echartsObjData(rp.data.data[1].returnHhhtOrderMap);
              // 注册人数
              const hhhtfl =this.echartsObjData(rp.data.data[1].returnHhhtRegisterMap);
              this.echartsLicaiObjhhht.push(hhhttz);
              this.echartsLicaiObjhhht.push(hhhtfl);
            }
          })
        }
      }, 60000);
    }
  }
}
</script>

<style lang="less" scoped>
  .we_index{
    display: flex;
    padding: 0.3rem 0.32rem;
    overflow: hidden;
    .wego_info_pane{
      display: flex;
      flex-basis: 50%;
    }

    // .model_margin{
    //   margin-bottom: 0.3rem;
    // }
    // .we_left{
    //   float: left;
    //   width: 6.88rem;
    //   height: auto;
    //   overflow: hidden;
    // }
    // .we_right{
    //   float: right;
    //   width: 11.34rem;
    // }
  }
</style>


